:root {
--gradient-primary:linear-gradient(135deg, #A35BFF 0%, #3D1EFE 100%);
--gradient-primary2:linear-gradient(94deg, #FF5B8C 0%, #3D1EFE 110%);
--gradient-secondary:linear-gradient(135deg, #0056FF 5.8%, #285AFF 39.68%, #2A76FF 68.34%, #2CCCFF 87.76%), conic-gradient(from 42.06deg at 48.82% 49.14%, #0075FF -139.69deg, #702CFF 52.5deg, #7CFFEF 112.77deg, #0075FF 220.31deg, #702CFF 412.5deg);
--icon-arrow:url('data:image/svg+xml,');
--icon-arrow-primary:url('data:image/svg+xml,');
--icon-arrow-white:url('data:image/svg+xml,');
--icon-hook:url('data:image/svg+xml,');
--icon-hook-muted:url('data:image/svg+xml,');
--icon-coil-hook:url('data:image/svg+xml,');
--icon-coil-hook-black:url('data:image/svg+xml,');
--icon-coil-hook-white:url('data:image/svg+xml,');
--icon-coil-hook-outline-black:url('data:image/svg+xml,');
--icon-arrow-right:url('data:image/svg+xml,');
--icon-arrow-right-black:url('data:image/svg+xml,');
--icon-arrow-right-primary:url('data:image/svg+xml,');
--icon-eye-show:url('data:image/svg+xml,');
--icon-eye-hide:url('data:image/svg+xml,');
--icon-win:url('data:image/svg+xml,');
--icon-win-primary:url('data:image/svg+xml,');
--icon-win-secondary:url('data:image/svg+xml,');
--icon-win-gray:url('data:image/svg+xml,');
--icon-mac:url('data:image/svg+xml,');
--icon-mac-primary:url('data:image/svg+xml,');
--icon-mac-secondary:url('data:image/svg+xml,');
--icon-mac-gray:url('data:image/svg+xml,');
--icon-android:url('data:image/svg+xml,');
--icon-android-gray:url('data:image/svg+xml,');
--icon-android-primary:url('data:image/svg+xml,');
--icon-ios:url('data:image/svg+xml,');
--icon-ios-gray:url('data:image/svg+xml,');
--icon-ios-primary:url('data:image/svg+xml,');
--icon-buy:url('data:image/svg+xml,');
--icon-buy-primary:url('data:image/svg+xml,');
--icon-buy-secondary:url('data:image/svg+xml,');
--icon-mh:url("data:image/svg+xml,");
--icon-fb:url("data:image/svg+xml,");
--icon-fb-hover:url("data:image/svg+xml,");
--icon-tw:url("data:image/svg+xml,");
--icon-tw-hover:url("data:image/svg+xml,");
--icon-in:url("data:image/svg+xml,");
--icon-in-hover:url("data:image/svg+xml,");
--icon-link:url("data:image/svg+xml,");
--icon-link-hover:url("data:image/svg+xml,")
}
/* flag */
.flag-icon {
display: inline-block;
border-radius: 100%;
overflow: hidden;
width: 16px;
height: 16px;
background-size: auto 100%;
background-repeat: no-repeat;
background-position: left center;
vertical-align: middle;
}
.flag-global {
border-radius:0;
background-image: url("data:image/svg+xml;utf8,");
}
.flag-us {
background-image: url("data:image/svg+xml;utf8,");
}
.flag-es {
background-position: center;
background-image: url("data:image/svg+xml;utf8,");
}
.flag-it {
background-image: url("data:image/svg+xml;utf8,");
}
.flag-fr {
background-image: url("data:image/svg+xml;utf8,");
}
.flag-de {
background-image: url("data:image/svg+xml;utf8,");
}
img {max-width: 100%;}
.icon {display: inline-block; font-size:0; line-height:0;}
.icon:after {display: block; content: ''; background-position:center;background-repeat: no-repeat;background-size: contain; width: 1.5rem; height: 1.5rem;}
.icon-sm:after {width: 1rem; height: 1rem;}
.icon-md:after {width: 1.25rem; height: 1.25rem;}
.icon-lg:after {width: 1.75rem; height: 1.75rem;}
.icon-xl:after {width: 2rem; height: 2rem;}
.icon-xxl:after {width: 2.5rem; height: 2.5rem;}
.icon-fb:after {background-image: var(--icon-fb);}
a:hover .icon-fb:after {background-image: var(--icon-fb-hover);}
.icon-tw:after {background-image: var(--icon-tw);}
a:hover .icon-tw:after {background-image: var(--icon-tw-hover);}
.icon-in:after {background-image: var(--icon-in);}
a:hover .icon-in:after {background-image: var(--icon-in-hover);}
.icon-link:after {background-image: var(--icon-link);}
a:hover .icon-link:after {background-image: var(--icon-link-hover);}
.dropdown-toggle {
position: relative;
padding-right: 1.5rem !important;
}
.dropdown-toggle::after {
border: 0;
margin: 0;
-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;
width: .5rem;
height: .5rem;
position: absolute;
top: 50%;
right:.625rem;
margin-top: -.225rem;
background-image: var(--icon-arrow);
background-repeat: no-repeat;
background-position:center;
background-size: contain;
}
.dropdown-toggle.arrow-white::after{
background-image: var(--icon-arrow-white);
}
.dropdown-toggle[aria-expanded="true"]::after {
transform: rotate(180deg);
}
.form-check-input-hook:checked[type=radio] {background:var(--gradient-primary);border: 0;}
.form-check-input-hook:checked[type=radio]:after {display: block; content: ''; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");}
.breadcrumb a {text-decoration: none; color: var(--bs-dark);}
.fw-100 {
font-weight: 100 !important;
}
.fw-200 {
font-weight: 200 !important;
}
.fw-300 {
font-weight: 300 !important;
}
.fw-400 {
font-weight: 400 !important;
}
.fw-500 {
font-weight: 500 !important;
}
.fw-600 {
font-weight: 600 !important;
}
.fw-700 {
font-weight: 700 !important;
}
.fw-800 {
font-weight: 800 !important;
}
.fw-900 {
font-weight: 800 !important;
}
.border-6 {border-width:6px !important;}
.text-overflow {display:block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.text-overflow-2,
.text-overflow-3,
.text-overflow-4,
.text-overflow-5 {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.text-overflow-3 {-webkit-line-clamp: 3;}
.text-overflow-4 {-webkit-line-clamp: 4;}
.text-overflow-5 {-webkit-line-clamp: 5;}
.img-height-overflow {height:150px; overflow: hidden; display: block;}
.link-hover-primary:hover {color: var(--bs-primary) !important;}
.link-hover-white:hover {color: #fff !important;}
.link-border-hover:hover {border-color: var(--bs-primary) !important; color: #000;}
.link-border-hover:not(.border) {border:solid 1px rgba(0, 0, 0, 0);}
.link-border-hover:not(.border):hover {border-color: var(--bs-primary) !important; color: #000;}
.link-bg-hover:hover {background-color: var(--bs-primary) !important; color: #fff !important;}
.btn-arrow img,
.btn-arrow svg {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.btn-arrow:hover img,
.btn-arrow:focus img,
.btn-arrow:hover svg,
.btn-arrow:focus svg {margin-left: .25rem;}
.btn-buy:not(.btn-none-icon):before,
.btn-mac:not(.btn-none-icon):before,
.btn-win:not(.btn-none-icon):before {display:inline-block;content:''; width: 24px; height: 24px; background-position: center; background-repeat: no-repeat; background-size: contain; vertical-align: middle; margin-right: .625rem; margin-bottom: .25rem;}
.btn-win:not(.btn-none-icon):before {background-image: var(--icon-win);}
.btn-mac:not(.btn-none-icon):before {background-image: var(--icon-mac);}
.btn-buy:not(.btn-none-icon):before {background-image: var(--icon-buy); background-size: 120% 120%;}
.btn-win.btn-light:not(.btn-none-icon):before {background-image: var(--icon-win-primary);}
.btn-mac.btn-light:not(.btn-none-icon):before {background-image: var(--icon-mac-primary);}
.btn-buy.btn-light:not(.btn-none-icon):before {background-image: var(--icon-buy-primary); background-size: 120% 120%;}
.btn-win.btn-outline-primary:not(.btn-none-icon):before {background-image: var(--icon-win-primary);}
.btn-mac.btn-outline-primary:not(.btn-none-icon):before {background-image: var(--icon-mac-primary);}
.btn-buy.btn-outline-primary:not(.btn-none-icon):before {background-image: var(--icon-buy-primary); background-size: 120% 120%;}
.btn-win.btn-outline-secondary:not(.btn-none-icon):before {background-image: var(--icon-win-secondary);}
.btn-mac.btn-outline-secondary:not(.btn-none-icon):before {background-image: var(--icon-mac-secondary);}
.btn-buy.btn-outline-secondary:not(.btn-none-icon):before {background-image: var(--icon-buy-secondary); background-size: 120% 120%;}
.btn-win.btn-outline-primary:hover:before {background-image: var(--icon-win);}
.btn-mac.btn-outline-primary:hover:before {background-image: var(--icon-mac);}
.btn-buy.btn-outline-primary:hover:before {background-image: var(--icon-buy);}
.btn-win.btn-outline-secondary:hover:before {background-image: var(--icon-win);}
.btn-mac.btn-outline-secondary:hover:before {background-image: var(--icon-mac);}
.btn-buy.btn-outline-secondary:hover:before {background-image: var(--icon-buy);}
.text-primary-gradual,
.text-secondary-gradual {background-image:var(--gradient-primary);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;text-fill-color: transparent;}
.text-secondary-gradual {background-image:var(--gradient-secondary);}
.text-decoration-underline.text-primary-gradual,
.text-decoration-underline.text-secondary-gradual {position: relative;}
.text-decoration-underline.text-primary-gradual:after,
.text-decoration-underline.text-secondary-gradual:after {display: block; content: ''; width:100%; height: 2px; position: absolute; top: 100%; left: 0; background-image: linear-gradient(135.53deg, #0157FF -12.48%, #019CFF 91.92%);}
.text-decoration-underline.text-secondary-gradual:after {background-image:var(--gradient-secondary);}
.btn-outline-primary,
.btn-outline-secondary {background-size:120%; background-position: center; -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.btn-primary-gradual,
.btn-primary-gradual2,
.btn-secondary-gradual {border-color:rgba(0, 0, 0, 0);background-image:var(--gradient-primary); background-size:120%; background-position: center; -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.btn-secondary-gradual {background-image:var(--gradient-secondary);}
.btn-primary-gradual2 {background-image:var(--gradient-primary2);}
.btn-outline-primary:hover,
.btn-primary-gradual:hover,
.btn-primary-gradual2:hover {background-image: linear-gradient(135deg, #3D1EFE 0%, #A35BFF 100%);border-color:rgba(0, 0, 0, 0);}
.btn-primary-gradual2:hover {background-image:linear-gradient(94deg, #3D1EFE 0%, #FF5B8C 110%);}
.btn-outline-secondary:hover,
.btn-secondary-gradual:hover {background: linear-gradient(313.7deg, #0056FF 5.8%, #285AFF 39.68%, #2A76FF 68.34%, #2CCCFF 97.76%);border-color:rgba(0, 0, 0, 0);}
.btn-outline-primary:hover .text-primary-gradual,
.btn-outline-secondary:hover .text-secondary-gradual {background: none;-webkit-text-fill-color:currentColor;}
.bg-img {background-position:center; background-repeat: no-repeat; background-size:cover; background-image: url(../images/banner-bg.jpg);}
.bg-primary-gradual {background-image:var(--gradient-primary);}
.bg-secondary-gradual {background-image:var(--gradient-secondary);}
.bg-primary-muted {--bs-bg-opacity: .05;background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;}
.bg-secondary-muted {--bs-bg-opacity: .05;background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;}
.hover-text-primary-gradual {color: #fff;}
a:hover .hover-text-primary-gradual {background-image: linear-gradient(135.53deg, #0157FF -12.48%, #019CFF 91.92%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;text-fill-color: transparent;}
.hover-bg-primary:hover {background-image: var(--gradient-primary) !important; color: #fff !important;}
.hover-bg-primary.border-secondary:hover {border-color: var(--bs-primary) !important;}
.hover-bg-primary:hover .text-muted,
.hover-bg-primary:hover .text-primary {color: #fff !important;}
.toggle-hide {display: none;}
.hover-bg-primary:hover .toggle-show {display: none;}
.hover-bg-primary:hover .toggle-hide {display: inline-block;}
.hover-border-primary:hover {border-color: var(--bs-primary) !important;}
.swiper{
--swiper-theme-color: var(--bs-primary);/* 设置Swiper风格 */
--swiper-navigation-color: #fff;/* 单独设置按钮颜色 */
--swiper-navigation-size: 20px;/* 设置按钮大小 */
}
.swiper-wrapper {align-items:stretch;}
.swiper-wrapper .swiper-slide {height: auto;}
.swiper .swiper-button-next,
.swiper .swiper-button-prev {background-color: var(--bs-dark);border-radius: 100px; width: 40px; height: 40px;padding:10px; text-align: center;}
body{position: relative;}
.header {position: sticky;top: 0; z-index: 1005; font-weight: 500; box-shadow: 0 0 1rem rgba(0,0,0,.2);}
.header a:not(.btn) {color: #000;}
.header .navbar {background-color: #000;}
.header .navbar-cont {display: flex; align-items: center; width: 100%;}
.header .header-language .dropdown-toggle {color: var(--bs-dark); padding-top: 1.125rem; padding-bottom: 1.125rem;}
.header .header-language .dropdown-menu.show {display: flex;flex-wrap:wrap;min-width:14rem;padding: .5rem;}
.header .header-language .dropdown-menu li {width: 50%;}
.header .header-language .dropdown-menu li a:hover {border-radius: 3px; background: var(--gradient-primary);color: #fff;}
.header .navbar-collapse {position: relative;}
.header .navbar-brand {padding:15px 0; line-height: 1;flex-shrink:0}
.header .navbar-brand img {height: 24px;}
.header .navbar-login a {text-decoration: none; color: #fff; font-size: 14px;}
.header .navbar-nav .dropdown-item {padding-top:.25rem;padding-bottom:.25rem; border-radius: 3px;}
.header .navbar-nav .dropdown-item:hover,
.header .navbar-nav .dropdown-item:focus {background-color:rgba(var(--bs-primary-rgb), .1);color: var(--bs-dark);}
.header .navbar-nav .dropdown-menu {border-radius: .5rem; font-weight: 500; }
.header .navbar-nav .dropdown-menu-features ul:first-child {border-right: 1px solid rgba(0, 0, 0, 0.07);}
.header .navbar-nav .dropdown-menu-features .dropdown-item {padding:.5rem .75rem;}
.header .navbar-nav .dropdown-menu li {padding:.125rem 0;}
.header .navbar-nav .btn-more {color: var(--bs-dark);}
.header .navbar-nav-login .btn-login {color: #fff; text-decoration: none;}
.searchbox form {display: flex; align-items: center; justify-content: flex-end; height: 100%; padding: 1rem;}
.searchbox form .btn-close {display: none;}
.searchbox label {display: flex; align-items: center; background-color: #fff; border-radius: 10rem;; padding:.325rem .75rem; width: 100%;}
.searchbox form input,
.searchbox form button {display: block; border:0; background-color: #fff;}
.searchbox form input {width: 100%;padding:0 .5rem;}
.searchbox form input:focus,
.searchbox form button:focus {box-shadow:none;}
.header .header-login {display: none;}
.header .header-account {display: none;}
.header .navbar-nav-login .header-login {display: block;}
.header .navbar-nav-login .btn-logout {display: none;}
.login-in .header-login,
.login-in .header .navbar-nav-login .header-login {display: none;}
.login-in .header-account {display: block;}
.login-in .header-account .btn-logout {display: none;}
.login-in .header .navbar-nav-login .btn-logout {display: block;}
@media(min-width:992px){
.header .navbar {background-color: #fff;}
.header .header-language .dropdown-toggle {padding-right: 1.5rem !important;}
.header .header-language .dropdown-menu {border-radius: .5rem;}
.header .navbar-login {display: none;}
.header .navbar-brand img {height: 30px;}
.header .navbar-nav .nav-item .nav-link {padding:1.21875rem .5rem;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.header .navbar-nav .nav-item .nav-link:hover,
.header .navbar-nav .nav-item .nav-link[aria-expanded="true"] {background-color:#F6EFFF;}
.header .navbar-nav .dropdown-menu {top:calc(100% + .75rem); padding:.5rem; border:0; box-shadow: 0 .25rem .5rem rgba(0,0,0,.2);min-width: 16rem;}
.header .navbar-nav .dropdown-menu::after {display: block;content: '';position: absolute;top: -.5rem;left:3rem;border-bottom: .5rem solid #fff;border-right: .5rem solid transparent;border-top: 0;border-left: .5rem solid transparent;width:0;height:0;}
.header .navbar-nav .dropdown-menu::before {display: block;content: '';position: absolute; top: -1rem; left:0; width:100%;height:1rem;}
.header .navbar-nav .dropdown-item {padding:.5rem;}
.header .navbar-nav .dropdown-menu-features {min-width:32rem; padding:1rem;}
.header .navbar-nav .dropdown-menu-cols li {border-top: 1px solid rgba(0, 0, 0, 0.07);}
.header .navbar-nav .dropdown-menu-cols li:first-child {border-top:0;}
.searchbox {display: none;position: absolute; top: 0; right:0; width: 100%; height: 100%; background-color: #fff; opacity:0; -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.searchbox.active {display: block; opacity:1;}
.searchbox label {border: solid 1.5px var(--bs-primary); width: 50%; max-width: 600px; padding:0 .75rem; margin-right:.5rem;}
.searchbox form .btn-close {display: block;}
.header-login {display: block;}
.header .header-login {display: block;}
.header .navbar-nav-login .header-login {display: none;}
.login-in .header-login {display: none;}
.login-in .header .navbar-nav-login .header-login {display: none;}
.login-in .header .navbar-nav-login .btn-logout {display: none;}
.login-in .header-account .btn-logout {display: block;}
}
@media(min-width:1200px){
.header .navbar-nav .nav-item .nav-link {padding-left: 1.21875rem; padding-right: 1.21875rem;}
}
@media(max-width:992px){
.header a:not(.btn) {color: #fff;}
.header .navbar {position: relative; z-index: 5;}
.header .navbar-toggler {height: 48px; margin-right: -1.25rem; margin-left: .25rem;}
.header .navbar-toggler.active {background-color:#242424;}
.header .navbar .navbar-toggler-icon {
width: 1.325rem; height: 1.325rem;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.header .navbar-toggler.active .navbar-toggler-icon {
background-image: url('data:image/svg+xml,');
}
.header .navbar-cont {width: auto;}
.header .navbar-brand {margin-right: 0;}
.header .navbar-collapse {display: none; opacity: 0;position:absolute; z-index: -1; top:100%; left:0; width:100%; min-height:calc(100vh - 48px); background-color:#242424;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;transition: all 0.3s;}
.header .navbar-collapse.show {display: block; opacity: 1;z-index: 5;}
.header .navbar-nav .nav-item {border-bottom: solid 1px rgba(255, 255, 255, 0.15); padding:.5rem 1.25rem;}
.header .navbar-nav .dropdown-item .img-svg-inject path{fill: rgba(var(--bs-white-rgb), .8);}
.header .header-language { margin-right: .25rem;}
.header .header-language .dropdown-toggle {color:#fff;padding-top: .625rem; padding-bottom: .625rem;}
.header .header-language .dropdown-toggle .flag-icon {display: none;}
.header .header-language .dropdown-toggle::after {background-image: var(--icon-arrow-white);}
.header .header-language .dropdown-toggle[aria-expanded="true"] {background-color: #242424; border-radius: 0;}
.header .header-language .dropdown-menu {background-color:#242424;margin-top:0;font-size:.875rem; border-top-right-radius: 0;}
.header .navbar-nav .nav-item .dropdown-toggle::after {background-image: var(--icon-arrow-white); width: .75rem; height: .75rem; right:.25rem; margin-top:-.375;}
.header .navbar-nav .dropdown-menu {background-color: inherit;}
.header .navbar-nav .dropdown-menu a {color: rgba(var(--bs-white-rgb), .8); padding: .5rem 0;}
.header .navbar-nav .dropdown-menu .btn-more {text-decoration: underline;}
.header .navbar-nav .dropdown-menu .dropdown-divider {display: none;}
.header .navbar-nav .dropdown-menu-features .dropdown-item {padding: .5rem 0;}
.header .navbar-nav .dropdown-menu-cols {display: flex; flex-wrap: wrap;}
.header .navbar-nav .dropdown-menu-cols li {width: 50%;}
}
@media(max-width:380px){
.header .navbar-nav .dropdown-menu {font-size: .875rem;}
.header .navbar-nav .dropdown-menu a span {margin-left: 0 !important;}
.header .header-language {margin-right:0;}
.header .header-language .dropdown-toggle {padding-left: .25rem; padding-right: 1.25rem !important;}
.header .header-language .dropdown-toggle::after {right:.5rem}
}
@media(max-width:320px){
.header .container {padding: 0 .625rem;}
.header .navbar-brand img {height: 20px;}
.header .navbar-nav .dropdown-menu-cols li {width: 100%;}
.header .navbar-collapse {max-height: 100%;overflow-y: auto;}
.header .navbar-toggler {margin-left:0; margin-right: -.625rem; padding-left: .5rem; padding-right: .5rem;}
}
.footer {font-size: .875rem;}
.footer a {color:rgba(var(--bs-dark-rgb), .9); text-decoration: none;}
.footer .dropdown-menu a {color:#000;}
.footer .dropdown-menu a:hover {background-color: inherit;}
.footer a:hover {color: var(--bs-primary);}
.footer .footer-brand {font-size: 1rem;border-bottom:1px solid rgba(var(--bs-dark-rgb), 0.08); padding:1.5rem 0 1rem;}
.footer .footer-menu {padding:3rem 0 0 0;}
.footer .footer-menu .title {font-weight:600; padding:.5rem 0; font-size: 1rem;}
.footer .footer-menu ul li {font-size: .875rem; padding:.325rem 0; font-weight: 400; opacity: 1;}
.footer .dropdown-menu {font-size: .875rem; border-radius: .5rem;}
.footer .dropdown-menu .dropdown-item {padding: .5rem 1rem;}
.footer .footer-payment {margin:1.5rem 0 1.5rem;}
.footer .footer-language {margin:1rem 0;}
.footer .footer-othernav {padding: 1rem 0 2rem;}
@media(min-width:992px){
.footer .footer-first {border-top:1px solid rgba(var(--bs-dark-rgb), 0.08);}
.footer .footer-second {border-top:1px solid rgba(var(--bs-dark-rgb), 0.08); border-bottom:1px solid rgba(var(--bs-dark-rgb), 0.08); }
.footer .footer-brand {border-bottom: 0; padding: 3rem 1rem 3rem 0; text-align: left;}
}
@media(max-width:991px){
.footer .footer-copyright {border-top:1px solid rgba(var(--bs-dark-rgb), 0.08);}
.footer .footer-payment {margin:0 0 1rem 0;}
.footer .footer-othernav {padding:.5rem 0 1rem; margin-left:calc(-0.833 * var(--bs-gutter-x));margin-right:calc(-0.833 * var(--bs-gutter-x)); margin-bottom: 1.5rem; /*border-bottom: 1px solid rgba(255, 255, 255, 0.25);*/}
}
@media(max-width:767px){
.footer .footer-brand {border-bottom: 0;}
.footer .footer-menu {padding: 0;}
.footer .footer-menu .title {font-size:1.125rem; padding:1rem 1.25rem;position: relative; border-top: 1px solid rgba(var(--bs-dark-rgb), 0.08);--bs-gutter-x:2.5rem;--bs-gutter-y: 0; margin: 0 calc(-0.5 * var(--bs-gutter-x));}
.footer .footer-menu .title:after {display: block;content: '';-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;transition: all 0.3s;width: 1rem;height: 1rem;position: absolute;top: 50%;right:1rem;margin-top: -.5rem;background-image: var(--icon-arrow);background-repeat: no-repeat;background-position:center;}
.footer .footer-menu .title.active:after {transform: rotate(180deg);}
.footer .footer-menu .title.active {border-bottom: 1px solid rgba(var(--bs-dark-rgb), 0.08);}
.footer .footer-menu ul {display: block; margin:0 0 .5rem 0;}
.footer .footer-menu ul li {padding: .325rem 0; font-size: .875rem;}
.footer .footer-menu .active + ul {display: none;}
.footer .footer-language {--bs-gutter-x: 1.5rem;--bs-gutter-y: 0;text-align: center; margin: .5rem -1.25rem; padding:.5rem 1rem;}
.footer .footer-language .btn {text-align: center;}
.footer .footer-language .dropdown-menu {width: 100%;}
.footer .footer-othernav {border-top: 1px solid rgba(var(--bs-dark-rgb), 0.08);}
.footer .footer-payment {padding-top:.5rem;padding-bottom:1rem; border-top: 1px solid rgba(var(--bs-dark-rgb), 0.08);border-bottom: 1px solid rgba(var(--bs-dark-rgb), 0.08);}
.footer .footer-payment .row {margin: 0 -.25rem;}
.footer .footer-payment .row .col {padding-left:5px;padding-right: 5px;}
}
.searchbox2 form {display: flex; align-items: center; justify-content: center; height: 100%;}
.searchbox2 label {display: flex; align-items: center; border: solid 1.5px #bdbdbd; background-color: #fff; border-radius: 10rem;; padding:.25rem .75rem; margin-right:.5rem; width:100%; max-width: 720px;}
.searchbox2 form input,
.searchbox2 form button {display: block; border:0; background-color: #fff;}
.searchbox2 form input {width: 100%;padding:0 .5rem;}
.searchbox2 form input:focus,
.searchbox2 form button:focus {box-shadow:none;}
@media(max-width:767px){
.searchbox2 label {margin-right:0;}
}
.icon-star:after,
.icon-star-f:after {display: block; content: ''; background-position:center;background-repeat: no-repeat;background-size: contain; width: 1.5rem; height: 1.5rem;}
.icon-star:after {background-image: url('data:image/svg+xml,');}
.icon-star-f:after {background-image: url('data:image/svg+xml,');}
.list-hook,
.list-hook-muted,
.list-coil-hook,
.list-coil-hook-black,
.list-coil-hook-white,
.list-coil-hook-outline-black {padding:0;list-style: none;}
.list-hook li,
.list-hook-muted li,
.list-coil-hook li,
.list-coil-hook-black li,
.list-coil-hook-white li,
.list-coil-hook-outline-black li {
padding-left: 1.5rem;
position: relative;
}
.list-hook li::before,
.list-hook-muted li::before,
.list-coil-hook li::before,
.list-coil-hook-black li::before,
.list-coil-hook-white li::before,
.list-coil-hook-outline-black li::before {
display: block;
content: '';
width: 1rem;
height: 1rem;
position: absolute;
top: .125rem;
left: 0;
background-repeat: no-repeat;
background-position: 0 0;
}
.list-hook li::before {
background-image: var(--icon-hook);
/* list-style:disc outside var(--icon-coil-hook); */
}
.list-hook li.icon-muted::before,
.list-hook-muted li::before {
background-image: var(--icon-hook-muted);
/* list-style:disc outside var(--icon-coil-hook); */
}
.list-coil-hook li::before {
background-image: var(--icon-coil-hook);
/* list-style:disc outside var(--icon-coil-hook); */
}
.list-coil-hook-black li::before {
background-image: var(--icon-coil-hook-black);
/* list-style:disc outside var(--icon-coil-hook-black); */
}
.list-coil-hook-white li::before {
background-image: var(--icon-coil-hook-white);
/* list-style:disc outside var(--icon-coil-hook-black); */
}
.list-coil-hook-outline-black li::before {
background-image: var(--icon-coil-hook-outline-black);
/* list-style:disc outside var(--icon-coil-hook-outline-black); */
}
.list-disc,
ol ul {list-style-type: disc;}
hr.line-dashed {height:0; background-color: initial; border-bottom:dashed 1px var(--bs-dark);}
.scrollshow {opacity:0; bottom: -100%; -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.scrollshow.show-top {bottom:auto; top: -100%;}
.scrollshow.show-left {bottom:auto; left: -100%;}
.scrollshow.show-right {bottom:auto; right: -100%;}
.scrollshow.active {bottom:0;opacity:1;}
.scrollshow.show-top.active {bottom:auto;top:0;}
.scrollshow.show-left.active {bottom:0;left:0;}
.scrollshow.show-right.active {bottom:0;right:0;}
.border-arrow-right,
.border-arrow-down {position: relative;}
.border-arrow-right:before,
.border-arrow-right:after,
.border-arrow-down:before,
.border-arrow-down:after {display: block; content:''; position: absolute; z-index: 1; width:0; height:0; top:100%; left: 50%; transform: translateX(-50%);border-top:1rem solid var(--bs-primary);border-right:1rem solid transparent;border-bottom:0;border-left:1rem solid transparent;}
.border-arrow-down:after {z-index: 2;border-top:1rem solid #fff; top: calc(100% - 1px);}
/* totop */
.totop {display: none;position: fixed; z-index:1000; right:1%;bottom:80px; width:40px;height:40px;background:var(--gradient-primary);border-radius: .5rem;}
.totop::after{display: block;content: '';width: 50%;height: 50%; margin: 25%; background-position:center;background-repeat: no-repeat;background-size: contain;background-image: url('data:image/svg+xml,');}
.totop.active {display: block;}
/* 弹窗消息 */
.j-toast {position: fixed; z-index: 1100; top: 0; left: 50%; transform: translateX(-50%); visibility: hidden; opacity: 0;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.j-toast.active {top: 5vh; opacity: 1; visibility: visible;}
.j-toast-item {border-radius: .5rem; background-color: #fff; margin: .5rem; padding: .75rem 1rem; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); display: flex; justify-content: space-between; gap: 1rem; font-size: .875rem;}
.j-toast-item .cont {display: flex; justify-content: space-between; gap: .5rem;}
.j-toast-danger {color: var(--danger);}
.j-toast-success {color: var(--success);}
/* index */
.banner-img .info {position: relative;}
.banner-img .pic {margin-top: -100px;}
@media (min-width: 768px) {
.banner-img .pic {overflow: hidden; margin-top: 0;}
}
@media (min-width: 992px) {
.banner-img .pic img {margin-top:0;margin-bottom: -120px;}
}
@media (min-width: 1200px) {
.banner-img .pic img {margin-top:-80px;margin-bottom:-190px;}
}
@media (min-width: 1300px) {
.banner-img .pic img {margin-top:-140px;margin-bottom: -190px;}
}
.step-start .num {position: relative;}
@media (min-width: 768px) {
.step-start .num:after,
.step-start .num:before {display: block; content: ''; position: absolute; z-index: -1; top: 50%; width: 50%; height: 0; overflow: hidden; border-top: dashed 1.5px var(--bs-primary);}
.step-start .num:after {right:0;}
.step-start .num:before {left:0;}
.step-start .item:first-child .num:before {display: none;}
.step-start .item:last-child .num:after {display: none;}
}
.vertical-tab-arrow-right .nav-link {display: block; color: #000; border: solid 2px #fff; background-color: #fff; padding:1.5rem;; border-radius: 1rem; position: relative;}
.vertical-tab-arrow-right .nav-link.active {color: initial; background-color: #fff;; border:solid 2px var(--bs-primary);}
@media (min-width: 992px) {
.vertical-tab-arrow-right .nav-link.active:before,
.vertical-tab-arrow-right .nav-link.active:after {display: block; content:''; position: absolute; z-index: 1; width:0; height:0; left:100%; top: 50%; transform: translateY(-50%);border-right:0;border-left:1rem solid var(--bs-primary);border-top:1rem solid transparent;border-bottom:1rem solid transparent;}
.vertical-tab-arrow-right .nav-link.active:after {z-index: 2;border-left:1rem solid #fff; left: calc(100% - 2px);}
}
#thumbs .swiper-slide-thumb-active .bg-primary-gradual {box-shadow:0 0 20px rgba(var(--bs-primary-rgb), .8);}
.resource-slide-item {--bs-p-resource-item-height:auto;min-height:var(--bs-p-resource-item-height);}
@media (max-width: 992px) {
.resource-slide-item {--bs-m-resource-item-height:360px;min-height:var(--bs-m-resource-item-height);}
}
.why-list .item {background: rgba(255, 255, 255, 0.15); border: 2px solid rgba(255, 255, 255, 0.12); border-radius: 1rem; height: 100%;}
.saying-item {height: 100%; position: relative; display: flex; flex-flow: column; justify-content:space-between;}
.saying-item::after {display: block; content: ''; position: absolute; top: 2rem; right: 2rem; width: 40px; height: 40px; background-image: var(--icon-mh); background-position: center; background-repeat: no-repeat; background-size: contain;}
@media (max-width: 768px) {
.saying-item::after {top: 1rem; right: 1rem; width: 20px; height: 20px;}
}
.tabs-style .nav {flex-wrap:nowrap; margin-bottom:2rem;}
.tabs-style .nav li {width:100%; padding-left:2rem;}
.tabs-style .nav li:first-child {padding-left: 0;}
.tabs-style .nav .nav-link { border: solid 1px var(--bs-primary);padding:1.5rem 2rem; color: var(--bs-gray); height: 100%; font-size: .875rem; border-radius:1rem;}
.tabs-style .nav .nav-link .title {font-weight: 600; margin-bottom: .875rem;}
.tabs-style .nav .nav-link p {margin-bottom:0; font-size: .875rem;}
.tabs-style .nav .nav-link svg {color: var(--bs-primary);}
.tabs-style .nav .active {background: var(--gradient-primary); color: var(--bs-light);}
.tabs-style .nav .active svg {color: var(--bs-light);}
.tabs-style .tab-content {border:solid 2px var(--bs-primary); border-radius: 1rem;}
.tabs-style .tab-pane {padding:1rem;}
@media (min-width: 992px) {
.tabs-style .tab-pane {padding:2rem;}
}
@media (min-width: 1300px) {
.tabs-style .tab-pane {padding:2rem 3rem;}
}
@media (max-width:992px) {
.tabs-style .nav {overflow-x:auto; margin-bottom: 1rem; padding-bottom: 1rem;}
.tabs-style .nav li {padding-left:1rem; min-width: 55%;}
.tabs-style .nav .nav-link {padding:1.5rem;}
}
@media (max-width: 767px) {
.tabs-style .nav li {min-width: 80%;}
}
/* article */
.page-path {font-size: .875rem;}
@media (max-width: 767px) {
.page-path {font-size: .75rem;}
}
.side-sticky {position: sticky; top: 80px;}
.article-side-menu-open {background:url('data:image/svg+xml,') no-repeat 0 0;width: 32px; height: 32px; cursor: pointer; position: sticky; top: 120px; left: 0;}
.article-side-menu {--bs-border-color:var(--bs-primary);--bs-border-width:1px;--bs-border-right:-1px;background-color: #fff; border: solid var(--bs-border-width) var(--bs-border-color); border-radius: .75rem;}
.article-side-menu a {color:#4f4f4f;}
.article-side-menu a:hover {color:var(--bs-primary);}
.article-side-menu .title {font-size: 1.25rem; font-weight: bold; padding:1rem; position: relative;}
.article-side-menu ul {margin:0; padding: 0; list-style: none; font-size: 1rem; font-weight: 500;}
.article-side-menu ul li {padding:.125rem 0; margin:0;}
.article-side-menu ul ul {border-bottom: solid 1px rgba(var(--bs-dark-rgb), .1); padding-bottom: 1rem; font-size: .875rem;}
.article-side-menu ul ul > li > a {display: block; margin:0 .5rem;}
.article-side-menu ul ul > li > a > span {display: block; padding:.6125rem .75rem; border-radius: 6px;}
.article-side-menu ul ul > li > a:hover,
.article-side-menu ul ul > li > a.active {font-weight: 600; color: var(--bs-primary);}
.article-side-menu ul ul > li > a:hover span,
.article-side-menu ul ul > li > a.active span {background-color: rgba(var(--bs-primary-rgb), .1);}
.article-side-menu > ul > li > a {display:block; text-decoration: none; background-repeat: no-repeat; background-position:1rem 1rem; background-image:var(--icon-coil-hook-outline-black); padding:.75rem .5rem .75rem 2.5rem; border-bottom: solid 1px rgba(var(--bs-dark-rgb), .1); -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.article-side-menu > ul > li > a:hover,
.article-side-menu > ul > li > a.active {background-image:var(--icon-coil-hook);color:#000;}
.article-side-menu ul.list-icon li a {background: none; padding:1rem;}
.article-side-menu ul.list-icon li a:hover,
.article-side-menu ul.list-icon li a.active {color: var(--bs-primary);}
.article-side-menu ul.list-icon li a.active {font-weight: bold;}
.article-side-menu ul.list-line li a {padding:0 .5rem 1.25rem; width:auto;background: none; border-bottom: 0; border-left: solid 4px transparent;}
.article-side-menu ul.list-line li a:before {display: block;content: '';width: 100%; height:1.25rem; border-top:solid 1px #dee2e6;}
.article-side-menu ul.list-line li:first-child a:before {border-top:0}
.article-side-menu ul.list-line li a:hover,
.article-side-menu ul.list-line li a.active {background-color:rgba(var(--bs-primary-rgb), .05); border-left: solid 4px var(--bs-primary); color: var(--bs-primary);border-image: linear-gradient(to bottom, #a35bff, #3D1EFE) 1;}
.article-side-menu .side-toggle-btn {display: block; position: absolute; top:1.25rem; right:var(--bs-border-right); padding:0 .5rem; border: solid var(--bs-border-width) var(--bs-primary); cursor: pointer; color: var(--bs-primary);}
.article-side-menu .side-toggle-btn:hover {background-color: var(--bs-primary); color:#fff;}
@media (min-width: 992px) {
.article-side-menu .title {padding:1rem 1.25rem;}
.article-side-menu .title.bg-primary-gradual {color: #fff;border-radius: .75rem .75rem 0 0;}
.article-side-menu ul.list-icon li a {padding:1rem 1.5rem;}
.article-side-menu ul.list-line li a {padding:0 1rem 1rem;}
.article-side-menu ul ul > li > a:hover,
.article-side-menu ul ul > li > a.active {background-image:var(--gradient-primary);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text; text-fill-color: transparent;}
}
@media (max-width: 767px) {
.side-sticky {position: relative; top: 0;}
.article-header .h1 {font-size: 2rem;}
.article-header .title {font-size: 1.75rem !important;}
.article-side-menu {position: relative; top: 0; border: 0;}
.article-side-menu .side-toggle-btn {display: none;}
.article-side-menu .title {border-left:0;position: relative;z-index: 2; border-top: solid 1px rgba(var(--bs-dark-rgb), .1); border-bottom: solid 1px rgba(var(--bs-dark-rgb), .1); padding: 1.5rem 0; padding-left: 60px; background-color:#fff; text-align: left;}
.article-side-menu .title::before {display: block; content: ''; background:url('data:image/svg+xml,') no-repeat 0 0;position: absolute; left:20px; top: 50%; margin-top:-16px; width: 32px; height: 32px;}
.article-side-menu .title:after {display: block; content: ''; background:var(--icon-arrow-right-primary) no-repeat 0 0; background-size: contain; position: absolute; right:25px; top: 50%; margin-top:-10px; width: 20px; height: 20px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.article-side-menu .title.bg-primary-gradual {background-image: none;}
.article-side-menu.active .title:after {-webkit-transform: rotate(90deg);transform: rotate(90deg);}
.article-side-menu .wrap {display:none; position: absolute; z-index: 1; top:0; left: 0; width: 100%; height:100%; background-color: rgba(0, 0, 0, .3);}
.article-side-menu.active .wrap {display: block;}
.article-side-menu > ul {display: none; position: absolute; z-index: 2; top: 100%; left:0; width: 100%; background-color: #fff; /*box-shadow: 0 40px 40px rgba(0,0,0,0.3);border-bottom: solid 2px var(--bs-primary);*/}
.article-side-menu ul li {margin:0;}
.article-side-menu ul li:first-child {border-top: 0;}
.article-side-menu.active ul {display: block;}
.article-side-menu ul ul {padding:1rem 0;}
.article-side-menu ul li a {display: block; background: none; padding:0 .25rem;}
.article-side-menu ul.list-icon li a {padding:1rem 2rem;}
.article-side-menu ul.list-line li a {padding:0 1.25rem 1.25rem;}
.article-side-menu ul.list-line li:first-child a:before {border-top: 0;}
.article-side-menu ul li a:hover,
.article-side-menu ul li a.active {background: none;}
}
.article-right-side .column {padding:.75rem; font-weight: 600; border-radius: 1rem 1rem 0 0; background: var(--gradient-primary); color: #fff; text-align: center;}
.article-right-side ul {padding:0; font-size: .875rem;border: solid 1px #c4c4c4; border-radius:0 0 1rem 1rem;}
.article-right-side ul li {border-top: solid 1px #c4c4c4;}
.article-right-side ul li:first-child {border-top:0;}
.article-right-side ul li a {display: block; padding:1rem; color: #737373;}
.article-right-side ul li a p {color: #333; margin-bottom: .5rem; font-weight: 500;}
.article-right-side ul li a:hover {border-radius: 4px; background-color: rgba(var(--bs-primary-rgb), .05);}
.resource-list .item {display: block; color: var(--bs-dark); -webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.resource-list .item:hover .title {color: var(--bs-primary);}
@media (min-width: 992px) {
.resource-list .item {padding:1.5rem;}
.resource-list .item:hover {border: solid 2px var(--bs-primary) !important; border-radius: 1rem;}
}
@media (min-width: 768px) {
.also-list li a {display:block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
}
.vr-primary-gradient,
.vr-secondary-gradient {position: relative; padding-left: 1.25rem;}
.vr-primary-gradient:before,
.vr-secondary-gradient:before {display: block; content: ''; width: 6px; height: 100%; background-image:var(--gradient-primary); position: absolute; top: 0; left: 0;}
.vr-secondary-gradient:before {background-image:var(--gradient-secondary);}
.articlenote{padding:1.5rem;border:1px dashed #7A99B8;background:#DCFFF9;overflow:hidden;margin-bottom:1.875rem;}
.articlenote span {font-weight: bold;}
.article-cont .h1,
.article-cont .h2,
.article-cont .h3,
.article-cont .h4,
.article-cont .h5,
.article-cont .h6,
.article-cont h1,
.article-cont h2,
.article-cont h3,
.article-cont h4,
.article-cont h5,
.article-cont h6 {margin-bottom:1.875rem;}
.article-cont ul,
.article-cont ul,
.article-cont ol,
.article-cont p,
.article-cont table {margin-bottom: 1.875rem;}
.article-cont p {line-height: 1.8;}
.article-cont li {margin-bottom:.75rem;}
.article-cont h2 {font-size: 1.75rem;}
.article-cont h3 {font-size: 1.375rem;}
.article-cont h4 {font-size: 1.25rem;}
.article-cont h5 {font-size: 1.125rem;}
.article-cont h6 {font-size: 1rem;}
.article-cont .h2 {font-size: 1.75rem;}
.article-cont .h3 {font-size: 1.375rem;}
.article-cont .h4 {font-size: 1.25rem;}
.article-cont .h5 {font-size: 1.125rem;}
.article-cont .h6 {font-size: 1rem;}
@media (min-width: 992px) {
.article-cont h2 {font-size: 1.75rem;}
.article-cont .h2 {font-size: 1.75rem;}
}
.think-icon a:hover,
.link-border:hover {border-color: var(--bs-primary) !important;}
.think-icon .col span {display: block; padding-top:.5rem; color:#3c3c3c;}
@media (min-width: 768px) {
.think-icon .col {width: 12%;max-width: 11rem;min-width: 11rem;}
}
.many-icon .col {width: 10%;max-width: 90px;min-width: 90px;}
@media (min-width: 992px) {
.article-also .swiper .swiper-pagination {display: none;}
}
@media (max-width: 991px) {
.article-also .swiper .swiper-button-next,
.article-also .swiper .swiper-button-prev {display: none;}
}
/* about */
@media (min-width: 992px) and (max-width:1300px) {
.about-header h1 {font-size:2rem;}
}
@media (min-width: 1301px) and (max-width:1400px) {
.about-header h1 {font-size:2.5rem;}
}
/* support */
@media (min-width: 768px) {
.border-md-top {border-top:1px solid #dee2e6;}
}
.support-form {max-width: 860px; margin: 0 auto;}
/* search */
.side-listlink {color: var(--bs-dark);}
.side-listlink .title {padding:.75rem; border-radius: 1rem 1rem 0 0; background: var(--gradient-primary); color: #fff; text-align: center;}
.side-listlink ul {margin: 0; padding:0; list-style: none; border:solid 1px #dee2e6; border-radius: 0 0 1rem 1rem}
.side-listlink ul li a {display: block; padding:0 1rem 1.25rem; border-bottom: 0; border-left: solid 4px transparent; color: var(--bs-dark);}
.side-listlink ul li a:before {display: block;content: '';width: 100%; height:1.25rem; border-top:solid 1px #dee2e6;}
.side-listlink ul li a:hover {color: var(--bs-primary); border-left: solid 4px var(--bs-primary); background-image:var(--gradient-primary);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;}
.side-listlink ul li:last-child a {border-bottom: 0;}
/* cookies */
.toast-accept-cookies {width: 100%; padding:1rem; position: fixed; z-index:10; bottom: 50px; left:0;}
.toast-accept-cookies .toast {width: 100%; max-width: 1320px; margin:0 auto;}
@media (min-width: 768px) {
.toast-accept-cookies {bottom:0;}
}
/* faq */
.tabs-style2 .nav {flex-wrap:nowrap; text-align: center; margin: 0 -1rem;}
.tabs-style2 .nav li {width:100%; padding: 1rem;}
.tabs-style2 .nav .nav-link {height: 100%;padding:2rem 0 2rem .5rem; font-size: 1.25rem; font-weight: bold; color: var(--bs-dark); display: flex; align-items: center;border-bottom:6px solid transparent; border:1px solid rgba(0, 0, 0, 0.125);border-radius:1rem; box-shadow:0 0 1rem rgb(0, 0, 0, .15);}
.tabs-style2 .nav li:last-child .nav-link:after {display: none;}
.tabs-style2 .nav .nav-link span {width: 100%; display: flex; align-items: center; flex-flow: column;}
.tabs-style2 .nav .nav-link img {margin-bottom:.5rem;}
.tabs-style2 .nav .nav-link.active,
.tabs-style2 .nav .nav-link:hover {color: var(--bs-dark);border-color:var(--bs-primary);border-width: 2px;}
@media (max-width: 767px) {
.tabs-style2 .nav {overflow-x: auto; padding-bottom: 1rem;}
.tabs-style2 .nav li {min-width:10rem;padding: .5rem;}
.tabs-style2 .nav .nav-link {font-size:1rem;padding:1rem;}
}
/* contact about */
.box-margin {margin-top: -10rem;}
.about-itemBox .item {position: relative;}
.about-itemBox .item:after {display: block; content: ''; width: 3px; height: 100%; background-color:#fff; position: absolute; top: 0; left: 0;}
/* feartures */
.features-side-sticky {position: sticky; top: 80px;}
.features-side {height: 100%; position: relative; z-index: 1;}
.side-features-menu {--bs-border-color:var(--bs-primary);--bs-border-radius:1.125rem;border: 1px solid var(--bs-border-color); border-radius:var(--bs-border-radius); background-color:#fff; width: 100%;}
.side-features-menu a {color: var(--bs-dark); text-decoration: none;}
.side-features-menu .title {font-size:1.25rem; font-weight: bold; text-align: center; border-bottom: 1px solid #efefef; padding: .875rem;}
.side-features-menu .menu-list {padding:.5rem 1.5rem;}
.side-features-menu .menu-list .name {font-weight: bold; margin:.5rem 0;}
.side-features-menu .menu-list .item {border-top: 1px solid #dee2e6;}
.side-features-menu .menu-list .item:first-child {border-top: 0;}
.side-features-menu .menu-list ul {font-size: .875rem;margin-top:1rem;border-radius:0;display: block;}
.side-features-menu .menu-list .name + ul {margin-top: 0;}
.side-features-menu .menu-list ul li img {width:18px; margin-right:.25rem;}
.side-features-menu .menu-list ul li a {display: block; padding:.5rem 1.5rem; margin:0 -1.5rem; border-left: solid 3px transparent;}
.side-features-menu .menu-list ul li a:hover,
.side-features-menu .menu-list ul li a.active {--bs-bg-opacity: .05;background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)); border-left-color: var(--bs-primary);}
.side-features-menu .menu-list ul li a.active {font-weight: bold;}
.side-features-menu .menu-list .list-line {font-size: 1rem;}
.side-features-menu .menu-list .list-line li a {padding:1.25rem 1.5rem 0; width:auto;}
.side-features-menu .menu-list .list-line li a:after {display: block;content: '';width: 100%; height:1.25rem; border-bottom:solid 1px #dee2e6;}
.side-features-menu .menu-list .list-line li a:hover,
.side-features-menu .menu-list .list-line li a.active {background-color: initial;}
@media (min-width: 992px) {
.side-features-menu {box-shadow: 0 0.5rem 1rem rgb(0, 0, 0, .15);}
.side-features-menu .menu-list .name {position: relative; cursor: pointer; padding: .5rem 0;}
.side-features-menu .menu-list .name:after {display: block; content: ''; background:var(--icon-arrow) no-repeat center; background-size: contain; position: absolute; right:0; top: 50%;transform: rotate(-90deg); margin-top:-6px; width: 12px; height: 12px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.side-features-menu .menu-list .item.active .name:after {transform: rotate(0deg);}
.side-features-menu .menu-list ul {display: none;}
.side-features-menu .menu-list .item.active ul {display: block;}
}
@media (min-width: 768px) and (max-width: 991px) {
.side-features-menu .menu-list {padding:0 1rem;}
.side-features-menu .menu-list ul li a {margin:0 -1rem;padding:.5rem 1rem;}
}
@media (max-width: 767px) {
.features-side {position: relative; top: 0; /*margin-left:calc(-0.3325 * var(--bs-gutter-x));margin-right:calc(-0.3325 * var(--bs-gutter-x)); */}
.side-features-menu {background-color: #fff; border:0;}
.side-features-menu .title {position: relative;z-index: 2; border-top: solid 1px #dee2e6;border-bottom: solid 1px #dee2e6; padding: 1.5rem 30px; background-color:#fff; text-align: left;}
.side-features-menu .title:after {display: block; content: ''; background:var(--icon-arrow-right-primary) no-repeat 0 0; background-size: contain; position: absolute; right:35px; top: 50%; margin-top:-10px; width: 20px; height: 20px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.side-features-menu.active .title:after {-webkit-transform: rotate(90deg);transform: rotate(90deg);}
.side-features-menu .wrap {display:none; position: absolute; z-index: 1; top:0; left: 0; width: 100%; height:100%; background-color: rgba(0, 0, 0, .3);}
.side-features-menu.active .wrap {display: block;}
.side-features-menu .menu-list {padding:.5rem 30px;}
.side-features-menu .menu-list .name {margin:1rem 0 .5rem;}
.side-features-menu .menu-list {display: none; position: absolute; z-index: 2; top: 100%; left: 0; width: 100%; background-color:#fff;}
.side-features-menu.active .menu-list {display: block;}
}
/* buy */
.buy-switch-menu {width:100%; margin:0 auto; position: relative;}
.buy-switch-menu .btn-group {width:100%;}
.buy-switch-menu .btn {flex-basis:50%; display: flex; align-items: center; justify-content: center; border-radius:.5rem; color:#702CFF; border-color:#702CFF;}
.buy-switch-menu .btn.active,
.buy-switch-menu .btn:hover {color: var(--bs-white);border-color: rgba(0, 0, 0, 0);background-image: var(--gradient-primary);background-size: 120%;background-position: center;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.buy-switch-menu .btn:last-child.active,
.buy-switch-menu .btn:last-child:hover {background-image: linear-gradient(135deg, #3D1EFE 0%, #A35BFF 100%);}
.buy-switch-menu .tips-arrow {position: absolute; top: -10px; white-space: nowrap; display: none; align-items:flex-start; font-size:.625rem; color: #18191F;}
.buy-switch-menu .tips-arrow.ta-right {left:100%; padding:0 0 0 80px;}
.buy-switch-menu .tips-arrow.ta-left {right:100%; top:0; padding:0 70px 0 0;}
.buy-switch-menu .tips-arrow img {margin:8px 0; position: absolute; top: 0; left: 0;}
.buy-switch-menu .tips-arrow.ta-left img {left:auto; right:0}
.buy-switch-cont .form-check-input:focus {box-shadow:none}
.buy-switch-cont .rounded-bottom-start {border-bottom-left-radius: 0.5rem !important;border-top-right-radius: 0.325rem !important;}
.buy-switch-cont .plan-select .plan-checked {display: none;}
@media (min-width: 576px) {
.buy-switch-menu {max-width:400px;}
}
@media (min-width: 992px) {
.buy-switch-menu .tips-arrow {display: flex;}
}
@media (max-width: 767px) {
.buy-switch-cont .price-plan.border-primary {background-color: rgba(var(--bs-primary-rgb), .05);}
.buy-switch-cont .plan-select {position: relative;}
.buy-switch-cont .plan-select .plan-checked {display: flex; align-items: center; justify-content: space-between; border: solid 1px rgba(var(--bs-dark-rgb), .1); background-color: #fff; padding:.875rem 1.75rem .875rem 1.25rem; border-radius: 10rem; font-size: .875rem; position: relative;}
.buy-switch-cont .plan-select .plan-checked:after {display: block; content: '';-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;width:.75rem;height:.75rem;position: absolute;top: 50%;right: .75rem;margin-top: -0.375rem;background-image: var(--icon-arrow-primary);background-repeat: no-repeat;background-position: center;background-size: contain;}
.buy-switch-cont .plan-select .plan-checked.active:after {transform: rotate(180deg);}
.buy-switch-cont .plan-select .plan-checklist {display: none; position: absolute; top: 110%; left: 0; width: 100%; border: solid 1px var(--bs-primary); background-color: #fff; border-radius: .5rem; padding:.5rem 1rem; font-size: .75rem; line-height: 1;}
.buy-switch-cont .plan-select .plan-checked.active + .plan-checklist {display: block;}
}
/* sign in */
.step-list .item {padding: 0;}
.step-list .item .dot {position: relative;}
.step-list .item .dot:after,
.step-list .item .dot:before {display: block;content: ''; width: 50%; height: 0; border: solid 2px #e0e0e0; position: absolute; z-index: -1; top: 50%; margin-top:-2px;}
.step-list .item .dot:after {left: 0;}
.step-list .item .dot:before {right: 0;}
.step-list .item:first-child .dot:after,
.step-list .item:last-child .dot:before {display: none;}
.step-list .item .dot span {display: block; width:18px; height: 18px; padding:4px; margin:0 auto; border-radius: 100%; background:#fff; position: relative;}
.step-list .item .dot span:after {display: block; content: ''; width:100%; height: 100%; background: #e0e0e0; border-radius: 100%;}
.step-list .item.active .dot:after,
.step-list .item.active .dot:before,
.step-list .item.active + .item .dot:after {border-color: var(--bs-primary);}
.step-list .item.active .dot span {background: var(--gradient-primary);}
.step-list .item.active .dot span:after {background: #fff;}
.step-list .name {font-size: .875rem; text-align: center; font-weight: 500; padding-top: 1rem; color:var(--bs-gray);}
.step-list .item.active .name {background:var(--gradient-primary);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text; text-fill-color: transparent;}
@media (min-width: 992px) {
.step-list .item .dot span {width:24px; height: 24px; padding:6px;}
.step-list .name {font-size: 1rem;}
}
.sign-box-wrap .bg-img { background-image: none; background-color: #fff; display: flex; align-items: center; min-height: calc(100vh - 60px);}
.sign-box-wrap .sign-box {background-color: #fff; padding: 5rem .5rem 8rem;}
.sign-box .column {font-size:2rem; line-height: 1.3; font-weight: 600; margin:0 0 1.625rem 0; text-align: center;}
.sign-box .info {font-size: .875rem; font-weight: normal; color: #4f4f4f; padding-top: .5rem;}
.sign-box .form-control {border-radius: .5rem;padding: 0.75rem 1rem; font-size:.875rem;}
.sign-box .btn {border-radius: 10rem;padding:0.75rem;}
.sign-box .other {display: flex; flex-flow: column; text-align: center; font-size: .875rem; font-weight: 400;}
.sign-box .other a {text-decoration: underline;}
.sign-box .box-form .password-input {position: relative;}
.sign-box .box-form .password-input .form-control {background: none;}
.sign-box .box-form .password-input .password-eye {position: absolute; top: 1.5rem; right: 0px; transform: translateY(-50%); display: block; width:40px; height:40px; background: var(--icon-eye-show) no-repeat center; background-size: 50%; cursor: pointer; opacity: .2;}
.sign-box .box-form .password-input .password-eye.active {background-image: var(--icon-eye-hide); opacity: .6;}
.sign-box .box-form .password-input .password-eye:hover {opacity: .6;}
.signup-wrap {display: flex; align-items: center; min-height: calc(100vh - 60px);}
.signup-box {display: flex; align-items: stretch; justify-content: space-between; width: 100%;}
.signup-box .sign-box {padding:5rem .5rem 8rem; margin: 0 auto;}
.signup-box .sign-box .info {font-size: 1rem; font-weight: 600;}
@media (min-width: 767px) {
.sign-box-wrap {padding:2rem;}
.sign-box-wrap .bg-img {padding:1.5rem;border-radius: 24px;background-image:url(../images/bg-pro2.png);min-height: calc(100vh - 120px);}
.sign-box-wrap .sign-box {border-radius: 24px; padding:2rem 3rem;}
.signup-box {padding: 2rem 0;}
}
@media (min-width: 992px) {
.signup-box .sign-box {width: 35%;padding:2rem 0; display: flex; flex-direction: column; justify-content: center;}
.signup-box .sign-box .column {text-align: left;}
.signup-box .signup-pic {width: 60%; border-radius: 1.5rem; overflow: hidden; background-position: center;background-repeat: no-repeat;background-size: cover; min-height: 560px; /*background-image: url(../images/banner-bg.jpg);*/}
.signup-box .signup-pic .img {height: 100%; background-position: center;background-repeat: no-repeat;background-size:100%;background-image: url(../images/user-banner.png);}
}
@media (min-width:1200px) {
.signup-box {padding: 2rem;}
.signup-box .sign-box {width: 30%;}
.signup-box .sign-box .column {font-size:3rem;}
.signup-box .sign-box .subcolumn {font-size:1.75rem;}
.signup-box .sign-box .info {font-size:1.25rem;}
}
@media (min-width: 1600px) {
.sign-box-wrap .bg-img {padding:5rem 3rem;}
}
@media (min-height: 1200px) {
.sign-box {min-height:450px;}
}
@media (max-width: 1300px) {
.signup-box .sign-box .column {margin:0 0 2.25rem 0;}
/* .signup-box .signup-pic .img {background-size:116%;} */
}
@media (max-width: 1200px) {
.signup-box .sign-box .subcolumn {font-size:1.5rem;}
}
@media (max-width: 767px) {
.sign-box-wrap .bg-img {align-items: start;}
.sign-box .column {font-size:1.75rem;}
.signup-wrap {align-items: start;}
}
@media (max-width: 320px) {
.sign-box-wrap .sign-box,
.signup-box .sign-box {padding-top:2rem;padding-bottom:2rem;}
}
.sign-box .select-dev {display: flex; list-style: none; margin: 0 -1rem; padding: 0;}
.sign-box .select-dev li {width: 50%; padding:.5rem;}
.sign-box .select-dev li a,
.sign-box .select-dev li label {display: block; display: flex; flex-flow: column; align-items: center; justify-content: center; padding: 1.25rem 0; background: #fff; box-shadow: 0 0 1rem rgb(0, 0, 0, .1); border:solid 2px #bdbdbd; border-radius: 1rem; color: #bdbdbd; font-size: 1.375rem; font-weight: 500; cursor: pointer; overflow: hidden; position: relative;}
.sign-box .select-dev li label input {position: absolute; top: -100%; left: 100%;}
.sign-box .select-dev li a:hover,
.sign-box .select-dev li label:hover,
.sign-box .select-dev li label.active {border-color: #8937e7; color: #8937e7;}
.sign-box .select-dev li .icon {display: block; width: 64px; height: 64px; background-position: center; background-repeat: no-repeat; background-size: contain; margin-bottom:.5rem;}
.sign-box .select-dev li .icon-android {background-image: var(--icon-android-gray);}
.sign-box .select-dev li .icon-ios {background-image: var(--icon-ios-gray);}
.sign-box .select-dev li a:hover .icon-android,
.sign-box .select-dev li label:hover .icon-android,
.sign-box .select-dev li label.active .icon-android {background-image: var(--icon-android-primary);}
.sign-box .select-dev li a:hover .icon-ios,
.sign-box .select-dev li label:hover .icon-ios,
.sign-box .select-dev li label.active .icon-ios {background-image: var(--icon-ios-primary);}
@media (min-width: 767px) {
.sign-box .select-dev li .icon {margin-bottom: 1rem;}
}
.order-header {box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05); padding:10px 0;}
.order-header .logoBox {display: flex; align-items: center;}
.order-box {padding:20px 0; font-size: 16px; font-weight: 500; font-family: 'Noto Sans',sans-serif; line-height: 24px;min-height: calc(100vh - 240px); display: flex; flex-direction: column; align-items: center; justify-content: center;}
.order-box-wrap .btn-primary {--bs-primary:#563aff;}
.order-box-wrap .btn-primary:hover {--bs-primary-hover:#ff4267;}
.order-box-wrap .text-primary {--bs-primary-rgb:86, 58, 255;}
.order-box-wrap .order-box-info .pro-box {padding:0 0 30px 0; margin-bottom: 30px;}
.order-box-wrap .order-box-info .pro-box .info {margin-left: 20px;}
.order-box-wrap .order-box-info .pro-box .name {margin: 15px 0 0 0; font-size: 16px;}
.order-box-wrap .order-box-info .pro-box .pri {font-size: 20px; line-height: 32px; font-weight:800; color: #FF3D00;}
.order-box-wrap .order-box-info .order-list {margin: 12px 0;}
.order-box-wrap .order-box-info .order-info {padding: 20px; margin:24px 0; font-size: 12px;}
.order-box-wrap .order-box-info .order-info p {margin-bottom: 20px;}
.order-box-wrap .order-box-from {margin-bottom: 20px;}
.order-box-wrap .order-box-from .contact-form {padding: 32px; border: solid 1px #d7d8e0; border-radius: 8px;}
.order-box-wrap .order-box-from .title {margin-bottom: 10px; font-size: 20px;}
.order-box-wrap .order-box-from .from-box {padding: 30px 0;}
.order-box-wrap .order-box-from .bottom-info {font-size: 12px;}
.order-box-wrap .order-box-from .bottom-info p {margin-bottom: 20px;}
.order-box-wrap .order-box-from .bottom-info a {text-decoration: underline;}
@media screen and (min-width: 992px) {
.order-box-wrap {display: flex;margin: 0 -20px;}
.order-box-wrap .order-box-info {width: 50%; padding:20px; order: 1;}
.order-box-wrap .order-box-from {width: 50%; padding:20px; order: 2;}
}
.order-success {padding: 50px 0; font-size: 16px; min-height: calc(100vh - 240px); display: flex; flex-direction: column; align-items: center; justify-content: center;}
.order-success .btn-primary {--bs-primary:#563aff;}
.order-success .btn-primary:hover {--bs-primary-hover:#ff4267;}
.order-success .text-primary {--bs-primary-rgb:86, 58, 255;}
.order-success-box {border:solid 1px #d7d8e0; border-radius: 8px; background-color: #fff; padding: 20px; max-width:570px; margin: 0 auto;}
.order-success-box .textarea-copy {display: block; border: 0; background-color: #fff; box-shadow: none; width: 100%; height:0; opacity: 0;}
.order-success-box .title {font-size: 24px; padding:10px 0;}
.order-success-box .subtitle {color:#FC4242}
.order-success-box .order-list .list {margin:10px 0;}
.order-success-box .order-info {padding:10px 0; font-weight:500;}
.order-success-box .order-paid {border-top: solid 1px #d7d8e0; padding:10px 0; font-weight:500;}
.order-success-box .order-btnBox {margin: 2px 0; display: flex; align-items: center; justify-content: center; gap: 10px;}
.order-success-box .order-btnBox a {display:block; margin:10px 0; padding-left: 15px; padding-right: 15px;}
.order-success-box .order-other {margin-top: 20px; font-size: 12px;}
@media screen and (min-width: 992px) {
.order-success-box {padding: 52px;}
.order-success-box .order-btnBox a {display: inline-block; padding-left: 32px; padding-right: 32px;}
}
.tabs-payment {border: 0;}
.tabs-payment .nav-link {border:solid 1px #C3C9CE; border-radius: 4px; color: #000; display: flex; align-items: center; justify-content: center;}
.tabs-payment .nav-link.active {border:solid 1px var(--bs-primary); box-shadow: 0 0 0 1px var(--bs-primary); color: var(--bs-primary);}
.card-cvv {padding-right: 40px; background-position: right calc(.375em + .1875rem) center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,");}
.paymentCont-wrap .form-control:focus,
.paymentCont-wrap .form-select:focus {box-shadow: none;}